// Element Plus 按需导入配置
import type { App } from 'vue'

// 只导入需要的组件
import {
  ElButton,
  ElInput,
  ElSelect,
  ElOption,
  ElIcon,
  ElTag,
  ElCard,
  ElDialog,
  ElForm,
  ElFormItem,
  ElDatePicker,
  ElSkeleton,
  ElEmpty,
  ElMessage,
} from 'element-plus'

// 只导入需要的图标
import {
  Shop,
  Menu,
  Search,
  Location,
  Calendar,
  Star,
  Lightning,
  Lock,
  Phone,
  Message,
  Goods,
  Money,
  Trophy,
  Check,
  ChatDotRound,
  TrendCharts,
  Link,
  DataAnalysis,
  Service,
} from '@element-plus/icons-vue'

// 只导入需要的样式
import 'element-plus/theme-chalk/el-button.css'
import 'element-plus/theme-chalk/el-input.css'
import 'element-plus/theme-chalk/el-select.css'
import 'element-plus/theme-chalk/el-option.css'
import 'element-plus/theme-chalk/el-icon.css'
import 'element-plus/theme-chalk/el-tag.css'
import 'element-plus/theme-chalk/el-card.css'
import 'element-plus/theme-chalk/el-dialog.css'
import 'element-plus/theme-chalk/el-form.css'
import 'element-plus/theme-chalk/el-form-item.css'
import 'element-plus/theme-chalk/el-date-picker.css'
import 'element-plus/theme-chalk/el-skeleton.css'
import 'element-plus/theme-chalk/el-empty.css'
import 'element-plus/theme-chalk/el-message.css'

// 基础样式
import 'element-plus/theme-chalk/base.css'

const components = [
  ElButton,
  ElInput,
  ElSelect,
  ElOption,
  ElIcon,
  ElTag,
  ElCard,
  ElDialog,
  ElForm,
  ElFormItem,
  ElDatePicker,
  ElSkeleton,
  ElEmpty,
]

const icons = [
  Shop,
  Menu,
  Search,
  Location,
  Calendar,
  Star,
  Lightning,
  Lock,
  Phone,
  Message,
  Goods,
  Money,
  Trophy,
  Check,
  ChatDotRound,
  TrendCharts,
  Link,
  DataAnalysis,
  Service,
]

export default function setupElementPlus(app: App) {
  // 注册组件
  components.forEach(component => {
    if (component.name) {
      app.component(component.name, component)
    }
  })

  // 注册图标
  icons.forEach(icon => {
    if (icon.name) {
      app.component(icon.name, icon)
    }
  })

  // 全局配置
  app.config.globalProperties.$message = ElMessage
}
